<template>
	<div class="y">
		<!-- 左边信息 -->
		<div v-for="(item,index) in lan">
			<div class="x" style="padding: 10px;" v-if="item.type==1">
				<image src="../../static/R-C.jpg" style="width: 40px;height: 40px;"></image>
				<div
					style="width: 80%;margin-left: 10px;background-color: #ff5500;padding: 10px;font-size: 14px;border-radius: 10px;color: white;">
					{{item.mu}}
				</div>
			</div>
			<!-- 右边信息 -->
			<div class="x" style="padding: 10px;" v-if="item.type==2">
				<div
					style="width: 80%;margin-left: 10px;background-color: #3ab056;padding: 10px;font-size: 14px;border-radius: 10px;color: white;">
					{{item.mu}}
				</div>
				<image src="../../static/5-8.jpg" style="width: 40px;height: 40px;margin: 0 8px;"></image>
			</div>
		</div>
		<!-- 输入框和发送 -->
		<div class="x"
			style="position: absolute;bottom: 0;width: 100vw;background-color: #eee;padding: 10px;align-items: center;">
			<input type="text"  v-model="xiao" @confirm="yuang"
				style="flex: 1;background-color: white;margin-right: 5px;padding: 6px 10px;border-radius: 20px;font-size: 14px;" />
			<div style="background-color: #3ab056;color: white;padding: 6px 14px;margin-right: 15px;border-radius: 6px;font-size: 14px;"
				@click="yuang">发送</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				xiao: "",
				lan: [],
				mess: ''
			}
		},

		methods: {
			yuang() {
				this.lan.push({
					type: 2,
					mu: this.xiao,

				})
				uni.showLoading({
					title: "fasongzhoing"
				})
				uni.request({
					url: 'https://api.lolimi.cn/API/AI/jj.php?msg=' +
						this.xiao, //仅为示例，并非真实接口地址。

					success: (res) => {
						uni.hideLoading()
						this.xiao = ""
						console.log(res)
						this.lan.push({
							type: 1,
							mu: res.data.data.output,

						})
					}
				});
			}
		}
	}
</script>

<style>

</style>